<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="keywords" content="碧江区电商扶贫,电商服务站点,扶贫大数据">
    <meta name="description" content="">
    <meta name="author" content="vimi8.com">
    <meta name="renderer" content="webkit">
    <link rel="icon" href="icon.ico">
    <title>碧江区大数据管理GIS应用平台</title>
    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.min.css">
    <link href="css/common.css" rel="stylesheet">
</head>

<body>
<!-- 地图窗口 -->
<div id="mapContainer"></div>

<!-- 左侧搜索窗口-->
<div id="left-panel">
    <div id="listTab">
        <ul id="myTab" class="nav nav-tabs">
            <li class="active"><a href="#siteTab" data-toggle="tab"><i class="fa fa-sitemap"></i> 村镇服务站点</a></li>
            <li><a href="#collectTab" data-toggle="tab"><i class="fa fa-users"></i> 集体经济组织</a></li>
        </ul>
        <div id="myTabContent" class="tab-content list-tab-pane">
            <div class="tab-pane active" id="siteTab">
                <div style="padding: 10px;">
                    <ul class="list-search list-unstyled list-inline">
                    <li class="dropdown area-dropdown">
                        <a href="#" title="所有地区"><span id="siteAreaLabel">所有地区</span> <i class="fa fa-caret-down"></i></a>
                        <div class="dropdown-menu area-list" role="menu">
                            <div class="area-village">
                                <ul class="list-unstyled">
                                    <li class="active"><a href="#areaB0" data-toggle="tab">所有地区</a></li>
                                    <li><a href="#areaB1" data-toggle="tab">市中办事处</a></li>
                                    <li><a href="#areaB2" data-toggle="tab">环北办事处</a></li>
                                    <li><a href="#areaB3" data-toggle="tab">河西办事处</a></li>
                                    <li><a href="#areaB4" data-toggle="tab">灯塔办事处</a></li>
                                    <li><a href="#areaB5" data-toggle="tab">川硐镇</a></li>
                                    <li><a href="#areaB6" data-toggle="tab">坝黄镇</a></li>
                                    <li><a href="#areaB7" data-toggle="tab">云场坪镇</a></li>
                                    <li><a href="#areaB8" data-toggle="tab">漾头镇</a></li>
                                    <li><a href="#areaB9" data-toggle="tab">桐木坪乡</a></li>
                                    <li><a href="#areaB10" data-toggle="tab">滑石乡</a></li>
                                    <li><a href="#areaB11" data-toggle="tab">和平乡</a></li>
                                    <li><a href="#areaB12" data-toggle="tab">瓦屋乡</a></li>
                                    <li><a href="#areaB13" data-toggle="tab">六龙山乡</a></li>
                                </ul>
                            </div>
                            <div class="area-country tab-content"id="siteAreaCountry">
                                <div class="tab-pane active" id="areaB0">
                                    <ul class="list-unstyled list-inline">
                                        <li><a href="#" data-areaid="520604000000" title="碧江区">碧江区</a></li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB1">
                                    <ul class="list-unstyled list-inline">
                                        <li><a href="#" data-areaid="520604002000" title="市中办事处">全部</a></li>
                                        <li><a href="#" data-areaid="520604002001" title="西门社区居委会">西门社区居委会</a></li>
                                        <li><a href="#" data-areaid="520604002002" title="南门社区居委会">南门社区居委会</a></li>
                                        <li><a href="#" data-areaid="520604002003" title="江宗门社区居委会">江宗门社区居委会</a></li>
                                        <li><a href="#" data-areaid="520604002004" title="东门社区居委会">东门社区居委会</a></li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB2">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区2</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB3">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区3</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB4">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区4</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB5">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区5</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB6">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区6</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB7">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区7</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB8">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区8</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB9">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区9</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB10">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区10</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB11">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区11</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB12">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区12</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="areaB13">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区13</li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="input-search">
                        <div class="input-group">
                            <input class="form-control" type="text" placeholder="搜索集体经济组织">
                            <span class="input-group-btn">
                                <button type="button" class="btn btn-info">搜索</button>
                            </span>
                        </div>
                    </li>
                </ul>
                <div class="search-result">
                    <div class="card-result">
                        <ul id="site-list" class="list-unstyled"></ul>
                        <script type="text/x-jsrender" id="dataListTmpl">
                            <li class="list-item" data-type="site" onclick='showDetail("{{:id}}",0)'>
                                <div class="list-marker" style="background-position:{{:(#index*-25)}}px 0"></div>
                                <div class="list-detail">
                                    <h3>{^{:name}}</h3>
                                    <p>{^{:address}}</p>
                                </div>
                            </li>
                        </script>
                        <div class="text-center">
                            <ul class="pagination pagination-sm">
                                <li><a href="#">&laquo;</a></li>
                                <li><a href="#">1</a></li>
                                <li><a href="#">2</a></li>
                                <li><a href="#">3</a></li>
                                <li><a href="#">4</a></li>
                                <li><a href="#">5</a></li>
                                <li><a href="#">&raquo;</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                </div>
            </div>
            <div class="tab-pane" id="collectTab">
                <div style="padding: 10px;">
                    <ul class="list-search list-unstyled list-inline">
                    <li class="dropdown area-dropdown">
                        <a href="#" title="所有地区"><span id="collectAreaLabel">所有地区</span> <i class="fa fa-caret-down"></i></a>
                        <div class="dropdown-menu area-list" role="menu">
                            <div class="area-village">
                                <ul class="list-unstyled">
                                    <li class="active"><a href="#area0" data-toggle="tab">所有地区</a></li>
                                    <li><a href="#area1" data-toggle="tab">市中办事处</a></li>
                                    <li><a href="#area2" data-toggle="tab">环北办事处</a></li>
                                    <li><a href="#area3" data-toggle="tab">河西办事处</a></li>
                                    <li><a href="#area4" data-toggle="tab">灯塔办事处</a></li>
                                    <li><a href="#area5" data-toggle="tab">川硐镇</a></li>
                                    <li><a href="#area6" data-toggle="tab">坝黄镇</a></li>
                                    <li><a href="#area7" data-toggle="tab">云场坪镇</a></li>
                                    <li><a href="#area8" data-toggle="tab">漾头镇</a></li>
                                    <li><a href="#area9" data-toggle="tab">桐木坪乡</a></li>
                                    <li><a href="#area10" data-toggle="tab">滑石乡</a></li>
                                    <li><a href="#area11" data-toggle="tab">和平乡</a></li>
                                    <li><a href="#area12" data-toggle="tab">瓦屋乡</a></li>
                                    <li><a href="#area13" data-toggle="tab">六龙山乡</a></li>
                                </ul>
                            </div>
                            <div class="area-country tab-content" id="collectAreaCountry">
                                <div class="tab-pane active" id="area0">
                                    <ul class="list-unstyled list-inline">
                                        <li><a href="#" data-areaid="520604000000" title="碧江区">碧江区</a></li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area1">
                                    <ul class="list-unstyled list-inline">
                                        <li><a href="#" data-areaid="520604002000" title="市中办事处">全部</a></li>
                                        <li><a href="#" data-areaid="520604002001" title="西门社区居委会">西门社区居委会</a></li>
                                        <li><a href="#" data-areaid="520604002002" title="南门社区居委会">南门社区居委会</a></li>
                                        <li><a href="#" data-areaid="520604002003" title="江宗门社区居委会">江宗门社区居委会</a></li>
                                        <li><a href="#" data-areaid="520604002004" title="东门社区居委会">东门社区居委会</a></li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area2">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区2</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area3">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区3</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area4">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区4</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area5">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区5</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area6">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区6</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area7">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区7</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area8">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区8</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area9">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区9</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area10">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区10</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area11">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区11</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area12">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区12</li>
                                    </ul>
                                </div>
                                <div class="tab-pane" id="area13">
                                    <ul class="list-unstyled list-inline">
                                        <li>碧江区13</li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="input-search">
                        <div class="input-group">
                            <input class="form-control" type="text" placeholder="搜村镇服务站点">
                            <span class="input-group-btn">
                                <button type="button" class="btn btn-info">搜索</button>
                            </span>
                        </div>
                    </li>
                </ul>
                <div class="search-result">
                    <div class="card-result">
                        <ul id="collect-list" class="list-unstyled"></ul>
                        <script type="text/x-jsrender" id="collectListTmpl">
                            <li class="list-item" data-type="collect" onclick='showDetail("{{:id}}",1)'>
                                <div class="list-marker" style="background-position:{{:(#index*-25)}}px -64px"></div>
                                <div class="list-detail">
                                    <h3>{^{:name}}</h3>
                                    <p>{^{:address}}</p>
                                </div>
                            </li>
                        </script>
                        <div class="text-center">
                            <ul class="pagination pagination-sm">
                                <li><a href="#">&laquo;</a></li>
                                <li><a href="#">1</a></li>
                                <li><a href="#">2</a></li>
                                <li><a href="#">3</a></li>
                                <li><a href="#">4</a></li>
                                <li><a href="#">5</a></li>
                                <li><a href="#">&raquo;</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
                </div>
            </div>
        </div>
        <div id="switchBtn">
            <a href="#"><i class="fa fa-angle-double-up"></i></a>
        </div>
    </div>
    <div id="siteDetail" class="org-detail nav nav-tabs">
        <div class="pane-header">
            <a href="#" onclick="showTab()"><i class="fa fa-angle-left"></i> <span class="text-info">返回</span> 服务站点列表</a>
        </div>
        <div class="pane-body list-tab-pane">
            <div class="pane-img">
                <img src="images/img_example_01.png" class="pull-left" alt="" width="100" height="100">
                <div class="pull-left">
                    <h3>金阳服务站点1</h3>
                    <p><i class="fa fa-fw fa-map-marker"></i> 碧江区川硐镇龙塘坳村1组</p>
                    <p><i class="fa fa-fw fa-user"></i> 田大大 13899998888</p>
                </div>
            </div>
            <ul class="list-unstyled list-inline pane-number">
                <li>
                    <label>38</label>
                    <small>贫困户</small>
                </li>
                <li>
                    <label>&yen;8000</label>
                    <small>产品收益</small>
                </li>
                <li>
                    <label>&yen;8000</label>
                    <small>销售额</small>
                </li>
            </ul>
            <div class="pane-part">
                <div class="part-title">
                    <h4><i class="fa fa-product-hunt"></i> 站点产品</h4>
                </div>
                <div class="owl-carousel owl-pagination-tr owl-module-data owl-theme owl-product" data-plugin-options='{"singleItem": false, "items": "4", "autoPlay": 3500, "navigation": true, "pagination": false, "stopOnHover": true}'>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_01.png" alt="">
                        <div class="p-name">西红柿</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_02.png" alt="">
                        <div class="p-name">葡萄</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_01.png" alt="">
                        <div class="p-name">西红柿</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_02.png" alt="">
                        <div class="p-name">葡萄</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_01.png" alt="">
                        <div class="p-name">西红柿</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_02.png" alt="">
                        <div class="p-name">葡萄</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_01.png" alt="">
                        <div class="p-name">西红柿</div>
                    </div>
                </div>
            </div>
            <div class="pane-part">
                <div class="part-title">
                    <h4><i class="fa fa-users"></i> 关联的贫困户</h4>
                </div>
                <table class="table table-bordered table-condensed table-hover table-poor">
                    <thead>
                        <th>序号</th>
                        <th>姓名</th>
                        <th>地址</th>
                        <th>总收益</th>
                    </thead>
                    <tbody>
                        <tr>
                            <td>1</td>
                            <td>王老二</td>
                            <td>碧江区川硐镇龙塘坳村1组</td>
                            <td>1000</td>
                        </tr>
                        <tr>
                            <td>2</td>
                            <td>王老三</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>3</td>
                            <td>王老四</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>4</td>
                            <td>王老五</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>5</td>
                            <td>王老六</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>6</td>
                            <td>王老七</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>7</td>
                            <td>王老八</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>8</td>
                            <td>王老九</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>9</td>
                            <td>王老十</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>10</td>
                            <td>王老幺</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                    </tbody>
                </table>
                <div class="text-center">
                    <ul class="pagination pagination-sm">
                        <li><a href="#">&laquo;</a></li>
                        <li><a href="#">1</a></li>
                        <li><a href="#">2</a></li>
                        <li><a href="#">3</a></li>
                        <li><a href="#">4</a></li>
                        <li><a href="#">5</a></li>
                        <li><a href="#">&raquo;</a></li>
                    </ul>
                </div>
            </div>
        </div>

    </div>
    <div id="collectDetail" class="org-detail nav nav-tabs">
        <div class="pane-header">
            <a href="#" onclick="showTab()"><i class="fa fa-angle-left"></i> <span class="text-info">返回</span> 集体经济组织列表</a>
        </div>
        <div class="pane-body list-tab-pane">
            <div class="pane-img">
                <img src="images/img_example_01.png" class="pull-left" alt="" width="100" height="100">
                <div class="pull-left">
                    <h3>田大大养殖合作舍</h3>
                    <p><i class="fa fa-fw fa-map-marker"></i> 碧江区川硐镇龙塘坳村1组</p>
                    <p><i class="fa fa-fw fa-user"></i> 田大大 13899998888</p>
                </div>
            </div>
            <ul class="list-unstyled list-inline pane-number">
                <li>
                    <label>38</label>
                    <small>贫困户</small>
                </li>
                <li>
                    <label>&yen;8000</label>
                    <small>工资收益</small>
                </li>
                <li>
                    <label>&yen;10000</label>
                    <small>分红收益</small>
                </li>
            </ul>
            <div class="pane-part">
                <div class="part-title collect">
                    <h4><i class="fa fa-product-hunt"></i> 集体经济组织产品</h4>
                </div>
                <div class="owl-carousel owl-pagination-tr owl-module-data owl-theme owl-product" data-plugin-options='{"singleItem": false, "items": "4", "autoPlay": 3500, "navigation": true, "pagination": false, "stopOnHover": true}'>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_01.png" alt="">
                        <div class="p-name">西红柿</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_02.png" alt="">
                        <div class="p-name">葡萄</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_01.png" alt="">
                        <div class="p-name">西红柿</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_02.png" alt="">
                        <div class="p-name">葡萄</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_01.png" alt="">
                        <div class="p-name">西红柿</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_02.png" alt="">
                        <div class="p-name">葡萄</div>
                    </div>
                    <div class="owl-product-item img-hover">
                        <img src="images/img_example_01.png" alt="">
                        <div class="p-name">西红柿</div>
                    </div>
                </div>
            </div>
            <div class="pane-part">
                <div class="part-title collect">
                    <h4><i class="fa fa-users"></i> 雇佣的贫困户</h4>
                </div>
                <table class="table table-bordered table-condensed table-hover table-poor">
                    <thead>
                        <th>序号</th>
                        <th>姓名</th>
                        <th>地址</th>
                        <th>总收益</th>
                    </thead>
                    <tbody>
                        <tr>
                            <td>1</td>
                            <td>王老二</td>
                            <td>碧江区川硐镇龙塘坳村1组</td>
                            <td>1000</td>
                        </tr>
                        <tr>
                            <td>2</td>
                            <td>王老三</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>3</td>
                            <td>王老四</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>4</td>
                            <td>王老五</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>5</td>
                            <td>王老六</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>6</td>
                            <td>王老七</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>7</td>
                            <td>王老八</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>8</td>
                            <td>王老九</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>9</td>
                            <td>王老十</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                        <tr>
                            <td>10</td>
                            <td>王老幺</td>
                            <td>碧江区川硐镇龙塘坳村2组</td>
                            <td>2000</td>
                        </tr>
                    </tbody>
                </table>
                <div class="text-center">
                    <ul class="pagination pagination-sm">
                        <li><a href="#">&laquo;</a></li>
                        <li><a href="#">1</a></li>
                        <li><a href="#">2</a></li>
                        <li><a href="#">3</a></li>
                        <li><a href="#">4</a></li>
                        <li><a href="#">5</a></li>
                        <li><a href="#">&raquo;</a></li>
                    </ul>
                </div>
            </div>
        </div>

    </div>
</div>

<!-- 图例 -->
<div id="legend" class="legend">
    <ul class="list-unstyled list-inline">
        <li><a href="#" class="site" id="siteLegend"><span></span> 服务站点</a></li>
        <li><a href="#" class="collect" id="collectLegend"><span></span> 集体经济组织</a></li>
    </ul>
</div>

<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="node_modules/jsviews/jsviews.min.js"></script>
<script src="node_modules/twbs-pagination/jquery.twbsPagination.min.js"></script>
<script src="node_modules/owl.carousel/dist/owl.carousel.min.js"></script>
<!--高德地图-->
<script src="http://webapi.amap.com/maps?v=1.3&key=d386663c19f421e1130e204a6bae281d"></script>
<script src="js/common.js"></script>
<script src="js/index.js"></script>
</body>

</html>
